<template>
    <section>
        <div class="wrapper">
            <div class="content">
              <p style="text-align:center">本人已阅读相关内容,自愿加入湖南师范大学教职工补充医疗互助,并将严格按照相关规定办理各项手续。</p>

              <van-radio-group v-model="radio" direction="horizontal">
                <van-radio name="是">是</van-radio>
                <van-radio name="否">否</van-radio>
              </van-radio-group>

              <div class="bottom">
                <p>
                  <button v-if="radio == '否' && !isSMTMAAF" @click="abandon">放弃</button>
                  <button v-if="radio == '否' && isSMTMAAF" @click="$router.go(-4);">放弃</button>
                  <button  @click="$troute.query('msRegister');" :disabled="radio != '是'">下一步</button>
                </p>
              </div>
            </div>
            
        </div>
    </section>
</template>
<script>
import api from "@/data/api/index.js";
import Vue from 'vue';
import { Checkbox } from 'vant';
import { Dialog } from 'vant';

Vue.use(Checkbox);

export default {
    data() {
        return {
            disabled: true,
            radio: "",
            jurisdiction: {},
            isSMTMAAF: false
        };
    },
    mounted (){
      let roles = JSON.parse(sessionStorage.getItem("jurisdiction"));
      this.jurisdiction = roles
      if (!roles.moreThanThreeYears) {
        if (roles.getInsurance == 0) {
          this.isSMTMAAF = false
        } else {
          this.isSMTMAAF = true
        }
      } else {
        this.isSMTMAAF = true
      }
    },
    methods:{
      abandon(){
        let this_ = this
        Dialog.confirm({
          title: '提醒',
          message: '入职超过3年，用户将不可再申请加入医疗互助，是否确定放弃',
          beforeClose,
        });
        function beforeClose(action, done) {
          if (action === 'confirm') {
            api.SMTMAAFAbandon().then(res=>{
              done()
              this_.$router.replace('/')
            })
          } else {
            done();
          }
        }
      }
    }
}
</script>
<style lang="scss" scoped>
section{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}
.wrapper{
    position: relative;
    padding: 25px 20px;
    box-sizing: border-box;
    .content{
        overflow: auto;
        text-align: justify;
        h3{
            font-size: 18px;
            text-align: center;
        }
        p{
            margin: .5em 0;
            line-height: 1.75em;
            font-size: 15px;
            text-indent: 2em;
        }
    }
    .bottom{
        span{
            display: inline-block;
            line-height: 1.5em;
            color: #2084d4;
            font-size: 15px;
            text-align: justify;
        }
        p{
            padding: 20px 20px 15px;
            overflow: auto;
            button{
                float: left;
                width: 46%;
                height: 45px;
                color: #9E0F16;
                font-size: 18px;
                background-color: transparent;
                border: 1px solid #9E0F16;
                border-radius: 22px;
                &:last-child{
                    float: right;
                    color: #fff;
                    background-color: #9E0F16;
                }
            }
            button[disabled]{
                background-color: #ddd;
                border: 1px solid #ddd;
            }
        }
        .van-checkbox{
            align-items: flex-start;
        }
    }
}

.van-radio-group{
  margin-left: 40%;
}
</style>